(function() {
  var domUtils = UE.dom.domUtils
  function getParentSwiperNode(tgt) {
    var tgtClassName = "UE-insert-swiper-wrapper"
    return domUtils.findParent (tgt , function (node) {
      return domUtils.hasClass(node , tgtClassName)
    } , true);
  }
  UE.registerUI('upload-video-dialog',function(editor,uiName){

    //创建dialog
    var dialog = new UE.ui.Dialog({
        //指定弹出层中页面的路径，这里只能支持页面,因为跟addCustomizeDialog.js相同目录，所以无需加路径
        iframeUrl: editor.ui.mapUrl('~/dialogs/oss-video/oss-video.html'),
        //需要指定当前的编辑器实例
        editor: editor,
        //指定dialog的名字
        name: uiName,
        //dialog的标题
        title: "上传OSS视频",

        //如果给出了buttons就代表dialog有确定和取消
        buttons:[
            {
                className:'edui-okbutton',
                label:'确定',
                onclick:function () {
                    dialog.close(true);
                }
            },
            {
                className:'edui-cancelbutton',
                label:'取消',
                onclick:function () {
                    dialog.close(false);
                }
            }
        ]});

    //参考addCustomizeButton.js
    var btn = new UE.ui.Button({
        name: uiName,
        title: "上传视频",
        onclick:function () {
            //渲染dialog
            dialog.render();
            dialog.open();
        }
    });

    return btn;
  })

  UE.registerUI('insertswiper', function (editor, uiName) {
    editor.registerCommand(uiName, {
      execCommand: function() {
        // <img src="/static/uploads/2024/08/12/gCo96edLn4Xhv6fYblmPCiB3hLrceSSc.png" alt="" />
        editor.execCommand('insertHtml', `
          <div class='UE-insert-swiper-wrapper' style='border: 1px solid red;'>
            
          </div>
        `, true);
      },
      queryCommandState: function() {
        var parentSwiperNode = getParentSwiperNode(editor.selection.getStart())
        return parentSwiperNode ? -1 : 0
      }
    });
    var btn = new UE.ui.Button({
        name: uiName,
        title: '插入轮播图',  // 这里是设置当鼠标指向这个按扭时显示的文字
        onclick: function () {
          editor.execCommand(uiName);
        }
    });
    editor.addListener('selectionchange', function() {
      var state = editor.queryCommandState(uiName);
      if (state == -1) {
          btn.setDisabled(true);
      } else {
          btn.setDisabled(false);
      }
    });
    // editor.document.body.appendChild(`
    //   <style>
    //     .UE-insert-swiper-wrapper:before{width:100%;height:30px;font-size:13px;line-height:30px;padding:0 10px;content:\'轮播图插件\';background:#3171bd;color:#fff;display:block;box-sizing:border-box;counter-reset:chapter;}
    //     .UE-insert-swiper-wrapper {min-height:100px;}
    //     .UE-insert-swiper-wrapper img {width:100px;height:100px;}
    //   </style>
    // `)
    
    // console.error("dawdawdadaw", editor)
    return btn;
  });

  UE.registerUI('deleteswiper', function (editor, uiName) {
    editor.registerCommand(uiName, {
      execCommand: function() {
        var parentSwiperNode = getParentSwiperNode(editor.selection.getStart())
        domUtils.remove(parentSwiperNode)
      },
      queryCommandState: function() {
        var parentSwiperNode = getParentSwiperNode(editor.selection.getStart())
        return parentSwiperNode ? 0 : -1
      }

    });
    var btn = new UE.ui.Button({
        name: uiName,
        title: '删除轮播图',  // 这里是设置当鼠标指向这个按扭时显示的文字
        onclick: function () {
          editor.execCommand(uiName);
        }
    });
    editor.addListener('selectionchange', function() {
      var state = editor.queryCommandState(uiName);
      if (state == -1) {
          btn.setDisabled(true);
      } else {
          btn.setDisabled(false);
      }
    });
    return btn;
  });
})();
